<template>
  <div>

    <div class="dialog-cover" v-show="guanbi" @click="guanbizz">
    </div>
    <div class="cart" v-show="guanbi" >
      <div class="cart-nav">

          <div class="cart-nav-left">
            <img class="ok" :src="choose ? thist : thisf"  alt="" @click="handleallchoose"/>
            <div>全选</div>
          </div>
          <div  class="cart-nav-right">
            <img class="laj" src="../../../static/images/laji.png" alt="" @click="over"/>
            <div>清除购物车</div>
          </div>

      </div>
       <div  class="cart-content">
           <div v-for="(item,index) of goodlist" :key="index">
             <jiajiantwo :item="item" />


            </div>
       </div>
    </div>
    <div class="bottom-nav">

      <div class="go-box" v-if="num === 0">
        <div :class="['go',{'goshoping':num>0}]">
          <img  class="go-i" :src="num === 0 ? srcs : nosrc" alt="" />
        </div>
        购物车是空的
      </div>
      <div class="go-box" v-else>
        <div :class="['go',{'goshoping':num>0}]">
          <img  class="go-i" :src="num === 0 ? srcs : nosrc" alt="" @click="guanbizz" />
          <div class="allnum">
            {{num}}
          </div>
        </div>
        <span class="rmb">￥</span><span class="allrmb">{{newprice}}</span>
      </div>

      <div :class="['Settlement',{'goshoping':newprice>0}]"  @tap="togoshopping"  v-if="userflag===false">
        去结算
      </div>
      <div :class="['Settlement',{'goshoping':newprice>0}]"  @tap="tologin" v-else>
        去结算
      </div>
    </div>
  </div>

</template>
<script>
  import jiajiantwo from '../jiajian2/jiajian'
  import Self from '@/self'
  export default {
    components:{
      jiajiantwo,

    },
    props: [],
    data() {
      return {
        userflag:true,
        num: 0,//总数目
        gooddetail: '',
        price: 16,
        srcs: require('../../../static/images/gog.png'),
        nosrc: require('../../../static/images/go2.png'),
        goodlist:[],
        guanbi:false,
        goods:{},
        allprice:0,
        newprice:0,
        thist: require('../../../static/images/ok.png'),
        thisf: require('../../../static/images/timg.jpg'),
        choose:true,
        gogoodlist:[]

      }
    },
    methods:{
      handleallchoose(){
        this.choose=!this.choose;
        if(this.choose===false){
          for(let i = 0;i<this.goodlist.length;i++){
            if(this.goodlist[i].choose===true){
              this.goodlist[i].choose=false;
              this.allprice =this.allprice-(Number(this.goodlist[i].price)*Number(this.goodlist[i].cishu));
              Self.$emit('allchooseFalse',this.goodlist[i].goodsid);
              // console.log('22222222222222')
            }

          }
        };
        if(this.choose===true){
          for(let i = 0;i<this.goodlist.length;i++){
            if(this.goodlist[i].choose===false){
              this.goodlist[i].choose=true;
              this.allprice =this.allprice+(Number(this.goodlist[i].price)*Number(this.goodlist[i].cishu));
              Self.$emit('allchooseTrue',this.goodlist[i].goodsid)
              // console.log('aaaaaaaaaaaaaa')
            }

          }
        };
        this.newprice=this.returnFloat(this.allprice);

        // console.log(this.goodlist);
      },
      guanbizz(){
        this.guanbi=!this.guanbi;
      },
      over(){
        this.goodlist=[];
        this.guanbi=false;
        this.num=0;
        wx.clearStorageSync();
        this.newprice=0;
        this.allprice=0;
        let over='over';
        Self.$emit('removed',over)

      },
      returnFloat(value){
          var value=Math.round(parseFloat(value)*100)/100;
          var xsd=value.toString().split(".");
          if(xsd.length==1){
                value=value.toString()+".00";
          return value;
          }
          if(xsd.length>1){
          if(xsd[1].length<2){
          value=value.toString()+"0";
            }
      return value;
                }
              },
      tologin(){
        wx.navigateTo({
          url: '/pages/tologin/main'
        })
      },
      togoshopping(){
        let gogolist=[];
        for(let i=0;i<this.goodlist.length;i++){
          if(this.goodlist[i].choose){
              gogolist.push(this.goodlist[i]);
          }
        }
        this.global.Allgoodlist=gogolist;
        this.global.allprice=this.newprice;
        wx.navigateTo({
          url: '/pages/goshopping/main'
        })
      }
          },
    mounted() {
      //接收A组件的数据
      Self.$on("add", function (a) {

        this.num ++;//总次数++
        if (this.goodlist.length === 0) {
          this.goodlist.push(a);
          this.allprice=Number(a.price) * Number(a.cishu);
        } else {
          // console.log(this.goodlist)
          for (let i = 0;i<this.goodlist.length;i++) {
            if(this.goodlist[i].goodsid === a.goodsid){
              this.goodlist[i].cishu=a.cishu;
              this.allprice =this.allprice+Number(a.price);
              break;
              // console.log(1)
            }
              else if(this.goodlist[i] ===a) {
              break;
            } else if(this.goodlist.includes(a) === false  ){
              this.goodlist.push(a);
              this.allprice=this.allprice+ Number(a.price);
              break;
            }
          }
        }
        this.newprice=this.returnFloat(this.allprice);
        // console.log(this.goodlist)
      }.bind(this));
      Self.$on("addonegoods", function (a) {
        this.num ++;//总次数++

          for (let i = 0;i<this.goodlist.length;i++) {
            if(this.goodlist[i].goodsid === a.goodsid){
              this.goodlist[i].cishu=a.cishu;
              if(a.choose===true){
                this.allprice =this.allprice+Number(a.price);
              }

              break;
            }

        }
        this.newprice=this.returnFloat(this.allprice);
        // console.log(this.goodlist)
      }.bind(this));
      Self.$on("addtwogoods", function (a) {
        this.num ++;//总次数++
        for (let i = 0;i<this.goodlist.length;i++) {
          if(this.goodlist[i].goodsid === a.goodsid){
            this.goodlist[i].cishu=a.cishu;


            break;
          }
        }
        this.allprice =this.allprice+Number(a.price);
        this.newprice=this.returnFloat(this.allprice);
        // console.log(this.goodlist)
      }.bind(this));
      Self.$on("remove", function (b) {

        this.num --;
        // console.log(this.num)
        if(b.choose===true){
          if(b.price){
            this.allprice= Number(this.allprice)- Number(b.price);
            this.newprice=this.returnFloat(this.allprice);
          }else{
            this.allprice= Number(this.allprice)- Number(b.GoodsPrice);
            this.newprice=this.returnFloat(this.allprice);
          }
        }



        for (let i = 0;i<this.goodlist.length;i++) {
          if (this.goodlist[i].cishu === 0) {
            this.goodlist.splice(i, 1);
            wx.setStorageSync('yy',this.goodlist);


          }else if(this.goodlist[i].goodsid === b.GoodsId){
            this.goodlist[i].cishu--;

            if(this.goodlist[i].cishu===0){
              this.goodlist.splice(i, 1);
              wx.setStorageSync('yy',this.goodlist);

            }
          }
        }
        if(this.goodlist.length === 0){
          this.guanbi=false;
        }


      }.bind(this));
      Self.$on('choose',function (a) {
        if(a.choose===false){
          for (let i = 0;i<this.goodlist.length;i++) {
            if(this.goodlist[i].goodsid === a.goodsid){
              this.goodlist[i].choose=a.choose;
              this.allprice =this.allprice-(Number(a.price)*Number(a.cishu));
              break;
            }
          }
          this.choose=false;
          this.newprice=this.returnFloat(this.allprice);
        }
        if(a.choose===true){
          this.choose=true;
          for (let i = 0;i<this.goodlist.length;i++) {
            if(this.goodlist[i].choose===false){
              this.choose=false;
              // console.log('我有执行吗？')
            }
            if(this.goodlist[i].goodsid === a.goodsid){
              this.goodlist[i].choose=a.choose;
              this.allprice =this.allprice+(Number(a.price)*Number(a.cishu));
              break;
            }
          }
          this.newprice=this.returnFloat(this.allprice);
        }
      }.bind(this))



    },
    onHide(){
      wx.setStorageSync('xx',this.num);
      wx.setStorageSync('yy',this.goodlist);
      wx.setStorageSync('zz',this.newprice);
      wx.setStorageSync('allp',this.allprice);

    },
    onUnload() {
      wx.setStorageSync('xx',this.num);
      wx.setStorageSync('yy',this.goodlist);
      wx.setStorageSync('zz',this.newprice);
      wx.setStorageSync('allp',this.allprice);
    },
    onLoad(){
      if(this.goodlist!==''){
        this.choose=true;
        for(let i = 0;i<this.goodlist.length;i++){

          if(this.goodlist[i].choose===false){
            this.choose=false;
            // this.allprice =this.allprice-(Number(this.goodlist[i].price)*Number(this.goodlist[i].cishu));
            // Self.$emit('allchooseFalse',this.goodlist[i].goodsid);
            // console.log('22222222222222')
          }

        }

      }
      if(wx.getStorageSync('xx')){
        this.num=  wx.getStorageSync('xx')

      }
      if(wx.getStorageSync('yy')){
        this.goodlist=  wx.getStorageSync('yy');
      }
      if(wx.getStorageSync('zz')){
        this.newprice = wx.getStorageSync('zz');
      }
      if(wx.getStorageSync('allp')){
        this.allprice = wx.getStorageSync('allp');
      }
      this.userflag=this.global.loginflag;

    },

    onShow(){
      this.userflag=this.global.loginflag;
      if(wx.getStorageSync('xx')){
        this.num=  wx.getStorageSync('xx')

      }
      if(wx.getStorageSync('yy')){
        this.goodlist=  wx.getStorageSync('yy');
      }
      if(wx.getStorageSync('zz')){
        this.newprice = wx.getStorageSync('zz');
      }
      if(wx.getStorageSync('allp')){
        this.allprice = wx.getStorageSync('allp');
      }

    }
  }
</script>
<style scoped>
  .rmb{
    color:red;
    font-size:25rpx;
  }
  .allrmb{
    color:red;
  }
  .dialog-cover {
    background: rgba(0, 0, 0, 0.8);
    position: fixed;
    z-index: 200;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .cart-content{
    width:95%;
    overflow: auto;
    max-height: 500rpx;
    border:1px solid aqua;
    margin:0 auto;
  }
  .ok{
    height: 50rpx;
    width: 50rpx;
    border-radius: 50%;
    border:1rpx solid #ccc;
  }
  .laj{
    height: 70%;
    width:14%;

  }

  .cart-nav-right{
    justify-content: flex-end;
    color: #cccccc;

  }
  .cart-nav-left,
  .cart-nav-right{
    height: 100%;
    width:50%;
    display: flex;
    align-items: center;
  }
  .cart-nav{
    height: 70rpx;
    width:95%;
    margin:0 auto;
    display: flex;
    font-size: 26rpx;
  }
  .cart{
    z-index:300;
    position: absolute;
    width: 100%;
    bottom:8%;
    background-color: #ffffff;
  }
  .bottom-nav{
    width:100%;
    height: 8%;
    position: absolute;
    bottom:0;
    background-color: #ccc;
    display: flex;
    z-index: 300;

  }
  .go-box{
    height: 100%;
    width:70%;
    position: relative;
    color:#ccc;
    background-color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .go{
    height: 120rpx;
    width:120rpx;
    position: absolute;
    bottom:23rpx;
    border-radius:50%;
    left:26rpx;
    background-color: #cccccc;
    display:flex;
    justify-content:center;
    align-items:center;


  }
  .Settlement{
    height: 100%;
    width:30%;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;

  }
  .go-i{
    height:80%;
    width: 80%;
    border-radius:50%;
    position: relative;
  }
  .goshoping{
    background-color: #49B152;
  }
  .allnum{
    position: absolute;
    left:83rpx;
    top:0;
    background-color:red;
    color:#ffffff;
    right:0px;
    border-radius:50%;
    text-align:center;
    font-size:22rpx;


  }

</style>
